<template>
    <div class="w-card" :style="width ? {width: width + 'px'} : {}">
        <div class="w-card-img" :style="imgHight ? {height: imgHight + 'px'} : {}">
            <img :src="imgSrc" alt="img" />
        </div>
        <div v-if="summary" class="w-card-summary">
            {{summary}}
        </div>
        <div v-else class="w-card-summary">
            <slot></slot>
        </div>
        <slot name="footer"></slot>
    </div>
</template>

<script>
export default {
    name: 'Card',
    props: {
        width: {
            type: Number,
            default: 0
        },
        imgSrc: {
            type: String,
            default: ''
        },
        imgHight: {
            type: Number,
            default: 0
        },
        summary: {
            type: String,
            default: ''
        }
    }
}
</script>